<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
		<title>Adaptive</title>
		<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
		<link rel="stylesheet" type="text/css" media="all" href="../../../production/elastic.css" />
		<link rel="stylesheet" href="default.css" type="text/css" media="screen" charset="utf-8" />
		<script src="../../../jquery.js" type="text/javascript" language="javascript" charset="utf-8"></script>
		<script src="../../../production/elastic.js" type="text/javascript" language="javascript" charset="utf-8"></script>
		<script src="elastic_gallery.js" type="text/javascript" language="javascript" charset="utf-8" />
		<style type="text/css" media="screen">
		/* <![CDATA[ */
			.left img, .right img{ cursor: pointer; }
		/* ]]> */
		</style>
		<script type="text/javascript" language="javascript" charset="utf-8">
		// <![CDATA[
			
		// ]]>
		</script>
	</head>
	<body>
		<div class="unit header-container">
			<div class="container header">
				<h1>Elastic CSS Framework Gallery</h1>
				<p>Elastic Gallery demo, this code is not prepared as a class, neither as a jquery plugin, its
				just a demo of how elastic can be used to create widgets.<br /> This also uses an implementation
				of elastic slider.</p>
			</div>
		</div>
		<div class="unit elastic-gallery">
			<div class="container" style="padding:5px;">
				<div class="unit">
					<div class="container" style="padding:10px;">
						<div class="unit">
							<div class="container horizontal-center image-container" style="width:375px; height:280px; position:relative; margin:0 auto; overflow:hidden;">
								<div class="unit image" style="text-align:center;">
									<img src="images/img1.jpg" />
								</div>
							</div>
						</div>
					</div>
				</div>
				<div class="unit columns same-height">
					<div class="fixed column left" style="width:26px;"><img class="vertical-center" src="images/left.png" title="" /></div>
					<div class="elastic column thumbnails-display">
						<div class="container thumbnails-display-container">
							<div class="unit thumbnails">
								<div class="thumbnail"><a href="images/img1.jpg"><img src="images/img1_thumb.jpg" /></a></div>
								<div class="thumbnail"><a href="images/img2.jpg"><img src="images/img2_thumb.jpg" /></a></div>
								<div class="thumbnail"><a href="images/img3.jpg"><img src="images/img3_thumb.jpg" /></a></div>
								<div class="thumbnail"><a href="images/img4.jpg"><img src="images/img4_thumb.jpg" /></a></div>
								<div class="thumbnail"><a href="images/img5.jpg"><img src="images/img5_thumb.jpg" /></a></div>
								<div class="thumbnail"><a href="images/img6.jpg"><img src="images/img6_thumb.jpg" /></a></div>
								<div class="thumbnail"><a href="images/img7.jpg"><img src="images/img7_thumb.jpg" /></a></div>
								<div class="thumbnail"><a href="images/img8.jpg"><img src="images/img8_thumb.jpg" /></a></div>
								<div class="thumbnail"><a href="images/img9.jpg"><img src="images/img9_thumb.jpg" /></a></div>
								<div class="thumbnail"><a href="images/img10.jpg"><img src="images/img10_thumb.jpg" /></a></div>
							</div>	
						</div>
					</div>
					<div class="fixed column right" style="width:26px;"><img class="vertical-center" src="images/right.png" title="" /></div>
				</div>
			</div>
		</div>
	</body>
</html>
